<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<!DOCTYPE html>
<html>
<tag:head title="图书管理" ctx="${ctx}"></tag:head>

<tag:body>
	<!-- 左 上 导航 -->
	<tag:nav ctx="${ctx}"></tag:nav>

	<!-- page content -->
	<div class="right_col" role="main">
		<div class="">
			<div class="clearfix"></div>

			<div class="row">
				<div class="col-md-12 col-sm-12 col-xs-12">
					<div class="x_panel">
						<div class="x_title">
							<h2>图书列表</h2>
							<ul class="nav navbar-right panel_toolbox">
								<li>
									<button type="button" class="btn btn-info" data-toggle='modal' data-target='.bs-example-modal-sb'><i class="fa fa-search">
										搜索图书</i>
									</button>
								</li>
								<li>
									<button type="button" class="btn btn-primary">全部图书</button>
								</li>
								<li>
									<button type="button" class="btn btn-success"><i class="fa fa-user-plus">
									</i> 添加图书
									</button>
								</li>
								<li>
									<button type="button" class="btn btn-warning"><i class="fa fa fa-tags">
									</i> 借出图书列表
									</button>
								</li>
								<li>
									<button type="button" class="btn btn-dark">已丢失图书</button>
								</li>
								<li>
									<button type="button" class="btn btn-danger" data-toggle="modal"
											data-target=".bs-example-modal-dbg"><i class="fa fa-trash-o"></i>删除选定
									</button>
								</li>
							</ul>
							<div class="clearfix"></div>
						</div>
						<div class="x_content">
							<table id="datatable-checkbox" class="table table-striped table-bordered bulk_action">
								<thead>
								<tr>
									<th width="5%"><input type="checkbox" id="check-all"></th>
									<th width="5%">ID</th>
									<th width="15%">书名</th>
									<th width="5%">类别</th>
									<th width="10%">作者</th>
									<th width="10%">出版社</th>
									<th width="15%">评分</th>
									<th width="5%">封面图</th>
									<th width="5%">在库状态</th>
									<th width="20%">操作</th>
								</tr>
								</thead>

								<tbody>
								<c:forEach var="book" items="${requestScope.books}">
									<tr>
										<td width="5%"><input type="checkbox"  name="table_records"/></td>
										<td width="5%">${book.bookId}</td>
										<td width="15%">${book.name}</td>
										<td width="5%">${book.bookClass.name}</td>
										<td width="10%">${book.author}</td>
										<td width="10%">${book.publish}</td>
										<td width="15%">
											<c:choose>
												<c:when test="${book.grade == null}">暂无评分</c:when>
												<c:otherwise>
													<c:forEach begin="1" end="${book.grade}">
														<i class="fa fa-star"></i>
													</c:forEach>
													${book.grade}分
												</c:otherwise>
											</c:choose>
										</td>
										<td width="5%"><a href="#" class="btn btn-info btn-xs" data-toggle='modal' data-target='.bigImage' onclick="bigImage('${ctx}/${book.bookImage}')">
											查看大图</a>
										</td>
										<td width="5%">
											<c:choose>
												<c:when test="${book.state == 0}">
													在库
												</c:when>
												<c:when test="${book.state == 1}">
													借出
												</c:when>
												<c:otherwise>
													丢失
												</c:otherwise>
											</c:choose>
										</td>
										<td width="20%">
											<a href='#' class='btn btn-info btn-xs' onclick='editBook(this)'><i class='fa fa-pencil'></i> 编辑 </a>
											<a href='#' class='btn btn-danger btn-xs' data-toggle='modal' data-target='.bs-example-modal-db' onclick='deleteBookInfo(this)'>
												<i class='fa fa-trash-o'></i>
												删除
											</a>
                                            <c:if test="${requestScope.state == 2}">
                                                <a href='#' class='btn btn-success btn-xs'  data-toggle='modal' data-target='.bs-example-modal-fb' onclick='findBookInfo(this)'><i class='fa fa-plus-circle'></i>入库</a>
                                            </c:if>

										</td>
									</tr>
								</c:forEach>
								</tbody>
							</table>
						</div>
					</div>
				</div>

			</div>


		</div>
	</div>
	<div class="emptyRow" style="margin-top: 40px;float: left;"></div>
	<!-- /page content -->

	<!-- footer content -->
	<tag:footer></tag:footer>
</tag:body>
<!-- javascript -->
<tag:javascript ctx="${ctx}">
	<!-- this page -->
	<script src="${ctx}/assets/js/admin/admin_book_list/admin_book_list.js"></script>
	<script>
		<c:if test="${requestScope.error != null}">
		createPNotify("提示信息","error","${requestScope.error}");
		</c:if>

        function initTable(){
            var $datatable = $('#datatable-checkbox');

            $datatable.dataTable( {
                destroy:true,
                "bPaginate": true, //翻页功能
                "bLengthChange": true, //改变每页显示数据数量
                "bFilter": true, //过滤功能
                "bSort": true, //排序功能
                "bInfo": false,//页脚信息
            } );
        }
        initTable();
	</script>
</tag:javascript>
</html>

<!-- start:删除图书 -->
<div class="modal fade bs-example-modal-db" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
						aria-hidden="true">×</span>
				</button>
				<h4 class="modal-title">删除图书</h4>
			</div>
			<div class="modal-body">
				<h4>确定删除选定的？</h4>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-primary">确定</button>
			</div>

		</div>
	</div>
</div>
<!-- end:删除图书 -->

<!-- start:删除多个图书 -->
<div class="modal fade bs-example-modal-dbg" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
						aria-hidden="true">×</span>
				</button>
				<h4 class="modal-title" id="myModalLabel2">删除图书</h4>
			</div>
			<div class="modal-body">
				<h4>确定删除选定的？</h4>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-primary">确定</button>
			</div>

		</div>
	</div>
</div>
<!-- end:删除多个图书 -->


<!-- start:搜索图书 -->
<div class="modal fade bs-example-modal-sb" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
						aria-hidden="true">×</span>
				</button>
				<h4 class="modal-title">搜索图书</h4>
			</div>
			<div class="modal-body">
				<form action="${ctx}/admin/searchBook" method="post">
					<div class="form-group col-sm-6">
						<select class="form-control">
							<option value="0" selected>ID</option>
							<option value="1">书名</option>
							<option value="2">作者</option>
							<option value="3">ISBN</option>
						</select>
					</div>
					<div class="form-group col-sm-10">
						<input type="text" id="searchKey" class="form-control" placeholder="请输入关键字...">
					</div>

				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				<button type="button" class="btn btn-primary">确定</button>
			</div>

		</div>
	</div>
</div>
<!-- end:搜索图书 -->

<!-- start:bigImage -->
<div class="modal fade bigImage" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<img src="" width="300px" height="300px">
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			</div>

		</div>
	</div>
</div>
<!-- end:bigImage -->

<!-- start:入库图书 -->
<div class="modal fade bs-example-modal-fb" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">×</span>
                </button>
                <h4 class="modal-title">找到图书</h4>
            </div>
            <div class="modal-body">
                <h4>确定找到图书?</h4>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">确定</button>
            </div>

        </div>
    </div>
</div>
<!-- end:入库图书 -->